<template>
  <div id="help_pubulic">
    <h5>5.订单确认并支付</h5>
    <img src="http://image2.artup.com/static/pc/help/public01.png" alt="" class="paddbot"/>
    <img src="http://image2.artup.com/static/pc/help/public02.png" alt=""/>
    <div class="contact_dec">
      <p>下达订单后，您会进入订单确认页面，需要您确认收货人信息，以及货物信息,选择是否需要发票以及支付方式，确认无误后就可点击提交订单进行支付。</p>
    </div>
    <h5>6.订单信息查询</h5>
    <img src="http://image2.artup.com/static/pc/help/makeorder.png" alt="" class="paddbot"/>
    <img src="http://image2.artup.com/static/pc/help/thegoods.png" alt=""/>
    <div class="contact_dec">
      <p>订单支付成功后，您可选择继续定制或者查看订单选项。至此您的{{info}}已经定制成功，请您在家中等候，雅昌将为您尽快完成印制，并妥善得送到您的手中，谢谢。</p>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        info: ''
      }
    },
    props: ['data'],
    methods: {},
    mounted() {
      this.info = this.data
    }
  }
</script>

<style lang="scss" type="text/scss" rel="stylesheet/sass" scoped>
  #help_pubulic {
    width: 100%;
    height: auto;
    color: #fff;
    box-sizing: border-box;
    display: block;
    .contact_dec {
      width: 100%;
      height: auto;
      padding-bottom: 20px;
      display: block;
      overflow: hidden;
      border-bottom: 1px solid #5b5b5b;
      &:last-child {
        border-bottom: none;
      }
    }

    p {
      color: #fff;
      font-size: 14px;
      line-height: 28px;
      font-family: "微软雅黑";
    }
    h5 {
      width: 100%;
      height: auto;
      display: block;
      color: #fff;
      font-size: 14px;
      line-height: 28px;
      font-family: "微软雅黑";
      overflow: hidden;
      padding-top: 20px;
      font-weight: bold;
      letter-spacing: 1px;
    }
    img {
      max-width: 100%;
      padding: 20px 0;
      display: block;
    }
    .paddbot {
      padding-bottom: 0 !important;
    }
  }
</style>
